const AxisOps = {
  axisLine: {
    show: true,
    lineStyle: {
      color: '#3d3d3d',
    },
  },
  axisTick: {
    show: false,
  },
  axisLabel: {
    color: '#b5dbff',
  },
  splitLine: {
    show: false,
  },
  nameTextStyle: {
    color: '#b5dbff',
  },
};

export const echartTheme = {
  grid: {
    left: 40,
    right: 40,
    bottom: 30,
  },
  // x
  categoryAxis: {
    ...AxisOps,
  },
  // y
  valueAxis: {
    ...AxisOps,
  },
  timeAxis: {
    ...AxisOps,
  },
  tooltip: {
    backgroundColor: 'rgba(0,0,0, 0.85)',
    borderColor: 'rgba(0,0,0, 0.85)',
    textStyle: {
      color: '#b5dbff',
    },
  },
  legend: {
    left: 'center',
    top: 8,
    icon: 'rect',
    itemWidth: 8,
    itemHeight: 5,
    textStyle: {
      color: '#b5dbff',
    },
  },
};
